import React, {useEffect, useState} from 'react';
import {Button, Form, Input, InputNumber, message, Modal, Space} from "antd";
import {MinusCircleOutlined, PlusOutlined} from "@ant-design/icons";
import UploadBanner from "@/cms/UploadBanner";

function UseAddEdit({queryList}) {
    const [open,setOpen] = useState(false),
        [loading,setLoading] = useState(false),
        [form] = Form.useForm();
    function onCancel(){
        setOpen(false)
    }
    useEffect(()=>{
        if (open === false){
            form.resetFields();
        }else if(open.ID){
            form.setFieldsValue({
                ...open,
            })
        }else{
            form.setFieldsValue({
                price_list:[{}],
                tags:[""]
            })
        }
    },[open])
    function onOk(){
        form.validateFields().then(values => {
            if (open.ID){
                values.ID=open.ID
            }
            ax.post("/api/addVipSetting",{
                ...values,
            }).then(res=>{
                message.success(res.data);
                queryList();
                onCancel();
            })
        })
    }
    return {
        setOpen,
        ModalDOM:<Modal
            title={open?.ID?"编辑":"添加"}
            open={open}
            onOk={onOk}
            onCancel={onCancel}
            confirmLoading={loading}
            width={800}
        >
            <Form
                labelCol={{span: 5}}
                wrapperCol={{span: 14}}
                form={form}
            >
                <Form.Item
                    label={"售价"}
                    name={"price"}
                    rules={[
                        {
                            required: true,
                            message: '请输入售价!',
                        },
                    ]}
                >
                    <InputNumber min={0.01} placeholder={"请输入"} />
                </Form.Item>
                <Form.Item
                    label={"到账金额"}
                    name={"amount"}
                    rules={[
                        {
                            required: true,
                            message: '请输入到账金额!',
                        },
                    ]}
                >
                    <InputNumber min={1} placeholder={"如: 3-5人"}/>
                </Form.Item>
            </Form>
        </Modal>
    }
}

export default UseAddEdit;